<template>
    <div>
        <Drawer width="640" v-model="show" @on-close="$emit('closeM')">
            <div class="demo-drawer-profile">
              <p :style="pStyle">驾驶员信息</p>
                <Row>
                    <Col span="12">
                      驾驶员姓名: {{code.driver_name}}
                    </Col>
                    <Col span="12">
                        驾驶员身份证: {{code.driver_cardno}}
                    </Col>
                    <Col span="12">
                       驾驶员联系方式: {{code.driver_tel}}
                    </Col>
                    <Col span="12">
                       车牌号: {{code.car_number}}
                    </Col>
                    <!-- <Col span="24">
                        道路运输: {{code.dlys}}
                    </Col> -->
                </Row>
                <Divider />
                <p :style="pStyle">物品信息</p>
                <div v-for="(item,index) in code.goodsList" :key="index+'i'">
                  <Row >
                      <!-- <Col span="12">
                        物品名称: {{item.goods_name}}
                      </Col> -->
                      <Col span="12" v-if="item.goods_pretend">
                        物品装货地:  {{item.goods_pretend_s + item.goods_pretend}}
                      </Col>
                      <!-- <Col span="12" v-if="item.goods_discharge_time">
                        物品卸货时间: {{item.goods_discharge_time}}
                      </Col> -->
                      <Col span="12" v-if="item.goods_discharge">
                        物品卸货地: {{item.goods_discharge}}
                      </Col>
                      <Col span="12" v-if="item.receiving_name">
                        收货人姓名: {{item.receiving_name}}
                      </Col>
                      <Col span="12" v-if="item.receiving_tel">
                        收货人电话: {{item.receiving_tel}}
                      </Col>
                      <Col span="12" v-if="index === 0 && item.ascription_code">
                        装货卸货区: {{getName(item.ascription_code)}}
                      </Col>
                  </Row>
                </div>
                <Row>
                  <Col span="24" v-if="code.car_is_ll">
                    是否为冷链: {{code.car_is_ll==1?'是':'否'}}
                  </Col>
                </Row>
                <Divider />
                <p :style="pStyle">同行人信息</p>
                <div v-for="(item,index) in code.peerList" :key="index+'s'">
                  <Row >
                      <Col span="12" v-if="item.passenger_name">
                        同行人姓名: {{item.passenger_name}}
                      </Col>
                      <Col span="12" v-if="item.passenger_cardno">
                        同行人身份证号: {{item.passenger_cardno}}
                      </Col>
                  </Row>
                  <Row >
                      <Col span="24" v-if="item.passenger_tel">
                        同行人联系方式: {{item.passenger_tel}}
                      </Col>
                  </Row>
                </div>
            </div>
            <Divider />
            <p :style="pStyle">进出口清单</p>
            <div class="img_list">
              <div v-for="item in code.coldchainList[0].jck_qd" :key="item"><img :src="item" alt="" preview="1"></div>
            </div>
            <Divider />
            <p :style="pStyle">进出口检疫检验证明</p>
            <div class="img_list">
              <div v-for="item in code.coldchainList[0].jck_jyzm" :key="item"><img :src="item" alt="" preview="2"></div>
            </div>
            <Divider />
            <p :style="pStyle">核酸检测证明</p>
            <div class="img_list">
              <div v-for="item in code.coldchainList[0].hs_zm" :key="item"><img :src="item" alt="" preview="3"></div>
            </div>
            <Divider />
            <p :style="pStyle">消杀证明</p>
            <div class="img_list">
              <div v-for="item in code.coldchainList[0].xs_zm" :key="item"><img :src="item" alt="" preview="4"></div>
            </div>
        </Drawer>
    </div>
</template>
<script>
import {
  getBdResult
} from '../../api/system/record'
export default {
  props: {
    showModal: {
      type: Boolean,
      default: false
    },
    code: {
      type: Object,
      default: () => {}
    }
  },
  watch: {
    showModal: function (n) { this._data.show = n }
  },
  data () {
    return {
      show: false,
      pStyle: {
        fontSize: '16px',
        color: 'rgba(0,0,0,0.85)',
        lineHeight: '24px',
        display: 'block',
        marginBottom: '16px'
      },
      columns: [
        {
          'code': 'LM00001',
          'name': '市辖区'
        },
        {
          'code': 'LM00002',
          'name': '古塔区'
        },
        {
          'code': 'LM00003',
          'name': '凌河区'
        },
        {
          'code': 'LM00004',
          'name': '太和区'
        },
        {
          'code': 'LM00005',
          'name': '黑山县'
        },
        {
          'code': 'LM00006',
          'name': '义县'
        },
        {
          'code': 'LM00007',
          'name': '凌海市'
        },
        {
          'code': 'LM00008',
          'name': '北镇市'
        }
      ]
    }
  },
  mounted () {
    this.$nextTick(() => {
      console.log(this.code)
      getBdResult({ register_code: this.code.register_code }).then(res => {
        console.log(res)
      })
    })
  },
  methods: {
    getName (code) {
      let name
      this.columns.forEach(item => {
        if (item.code === code) name = item.name
      })
      return name
    }
  }
}
</script>
<style>
    .demo-drawer-profile{
        font-size: 14px;
    }
    .demo-drawer-profile .ivu-col{
        margin-bottom: 12px;
    }
    .img_list{
    margin: 20px 0.853rem;
    display: flex;
    }
  .img_list img{
      width: 120px;
      height: 120px;
      margin-right: 20px;
    }
</style>
